﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title> 翻页效果测试  </title>



    <script src="../Scripts/jquery-1.8.2.js" type="text/javascript"></script>


    <!--  该 js 从  http://code.google.com/p/page-nav-js-jquery/  下载.   -->
    <script src="pagenav1.1.cn.js" type="text/javascript"></script>




<style type="text/css" media="screen">
a { color:#2B4A78; text-decoration:none; }
	a:hover { color:#2B4A78;text-decoration:underline; }
	a:focus, input:focus {outline-style:none; outline-width:medium; }

/* custom css style: pageNum,cPageNum */
.pageNum{border: 1px solid #999;padding:2px 8px;display: inline-block;}
.cPageNum{font-weight: bold;padding:2px 5px;}
#pageNav a:hover{text-decoration:none;background: #fff4d8; }

</style>



<script>

$(function(){ 
	//optional set
	pageNav.pre="PRE";
	pageNav.next="NEXT";
	
	 //  p:current page number.  
	 //  pn: page sum.
	pageNav.fn = function(p,pn){
		// document.getElementById("test").innerHTML ="Page:"+p+" of "+pn + " pages.";
		$("#test").text("Page:"+p+" of "+pn + " pages."); //for jquery
	};
	
	//goto the page 3 of 33.
	pageNav.go(3,33);

});

</script>


</head>
<body>



<div id="test" style="height:70px;padding:30px 10px;font-size: 300%;"></div>

<div id="pageNav"></div>


</body>
</html>
